<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>
    第四课.
    页面跳转各种方法.
    window对象
  </title>
</head>
<body>
遍历对象属性：
Object.keys();

window.navigator 对象
  常用属性：
    userAgent: 返回浏览器类型和操作系统类型

window.location 对象
  表示浏览器当前页面的现实的URL信息
    href 读取或者设置当前页面的url信息
    hash 哈希值
    .reload() 重新加载当前页面

window.history 对象
  保存着当前浏览器访问页面的历史顺序
  length: 访问历史中共有多少页面
  back() 退回上一个页面
  forward() 访问下一个
  go(num) 直接跳转到下NUM个页面

window.screen 对象
  代表当前浏览器窗口所在的显示屏幕
  width
  height
  availwidth
  availHeight
  screen.pixelDepth 返回像素深度


<!-- ······························· -->

Event 对象
  每当浏览器中发生一个事件时，浏览器会自动创建一个event对象，
  并传递给指定的事件处理函数。浏览器中的可以分为三种类型：
  1. MouseEvent: 事件源，事件发生的坐标(x/y);
  2. keyEvent： 事件源，keyCode:按键码
  3. StateEvent： state 状态

事件句柄 (Event Handler):
  每个事件发生时，浏览器会查看该事件是否制定了对应的处理函数，函数即为 event hanlder
  若是指定了该浏览器会自动调用该函数。

  btnObj.onclick = func
  return false; 打断事件执行

事件冒泡
  event.cancelBubble = true; 取消事件冒泡
  event.stopPropagation();
  event.preventDefault();
    IE: HTML/JavaScript 中的事件句柄中可以直接使用event对象
    FF：HTML中的事件句柄可以使用event对象，JS中的事件无法直接使用只能用func(event)

  clientX:事件发生时，相对于浏览器显示区域的X坐标
  clientY:事件发生时，相对于浏览器显示区域的Y坐标

  screenX:事件发生时，相对于显示器显示区域的X坐标
  screenY:事件发生时，相对于显示器显示区域的Y坐标

  offsetX:事件发生时，相对于当前事件源元素显示区域的X坐标
  offsetY:事件发生时，相对于当前事件源元素显示区域的Y坐标

  event.keyCode: 键盘事件发生时，获取键盘键位码

获取事件源：
  var obg = event.srcElement || event.target (❤)




<!-- ========= -->
  input.getAttribute('value') 不能动态的获取值
  input.value 获取动态的值
<!-- ========= -->

<!-- ========================================== -->

// 每隔三秒刷一次
<!-- <meta http-equiv="refresh" content="3"> -->
// 指定时间跳转
<!-- <meta http-equiv="refresh" content="1;03.html"> -->

<!-- ========================================== -->

实现页面跳转的方法：
  1. a标签
  2. form action="url"
  3. location.href = 'url'
  4. winodw.open(url)
  5. meta http-equiv=Refresh content='1:'
  服务器端可实现页面跳转的方法：----- 控制HTTP响应头


<button id="test">点点我</button>
<script>
  // 遍历一个对象
  var emp = {salary: 3000, map: '1321'};
  var coder = Object.create(emp);
  coder.skilledLanguage = 'js';
  //  Object.defineProperty(
  //      coder,
  //      'skilledLanguage',
  //      {
  //        enumerable:false // 让其无法遍历
  //      }
  //  );
  //  for (var i in coder) {
  //    // console.log(i + '=>'+coder[i]);
  //    if (coder.hasOwnProperty(i)) { // 输出自有的属性
  //      console.log(i + '=>' + coder[i]);
  //    }
  //  }

  //  for (var attr in window.navigator) {
  //    console.log(attr + '-------' + navigator[attr]);
  //  }

  // 设置一个网页弹窗
  //  open(
  //      '04.html',
  //      'newwindow',
  //      'width=400,height=300,top=100,left=0'
  //  );

  document.getElementById('test').onclick = function (e) {
    e.cancelBubble = true; // 禁止事件冒泡
    console.log(e);
  };
  document.body.onclick = function () {
    alert();
  };
  document.addEventListener('click', function (e) {
    console.log('事件发生的坐标：' + e.clientX + ' ' + e.clientY);
  });
  document.addEventListener('keydown',function (e) {
    console.log(e.keyCode);
  })
</script>
</body>
</html>